<script setup lang="ts">
import LexicalTest from './components/lexicalTest.vue'
import Markdownit from './components/markdownit.vue';
import Flow from './components/flow/index.vue'
import { Button,TabPane,Tabs,Card } from 'ant-design-vue';
import PortalToFollowElemTest from './components/portal-to-follow-elem/test.vue';
import Editor from './components/editor/index.vue'
import Dnd  from './components/draggable/dnd.vue'
import {ref} from 'vue';
import VueDraggblePlus from './components/draggable/vue-draggble-plus.vue';

const activeTab = ref('');
</script>

<template>
  <Card>
    <Tabs v-model:activeKey="activeTab" class="w-full ">
     <TabPane key="Leixical" tab="Leixical">
      <LexicalTest/>
     </TabPane>
     <TabPane key="markdownit" tab="markdownit">
      <Markdownit/>
     </TabPane>
     <TabPane key="Flow" tab="Flow">
      <Flow/>
     </TabPane>
     <TabPane key="Editor" tab="Editor">
      <Editor/>
     </TabPane>
     <TabPane key="PortalToFollowElem" tab="PortalToFollowElem">
      <PortalToFollowElemTest>
      </PortalToFollowElemTest>
     </TabPane>
     <TabPane key="dnd" tab="dnd">
      <Dnd />
     </TabPane>
      <TabPane key="VueDraggblePlus" tab="VueDraggblePlus">
      <VueDraggblePlus />
     </TabPane>
   </Tabs>
  </Card>
  

</template>

<style scoped>

</style>
